// import Taro from '@tarojs/taro';
// import { View } from '@tarojs/components';
// import { ForwardRefRenderFunction, forwardRef, useImperativeHandle } from 'react';
// import { TabBarItemProps } from 'ossaui/types/tabbar';
// import IconFont from '@/components/Iconfont';
// import cssModule from './index.module.scss';
// import { useTabBarStore } from './store';

// interface TabBar extends TabBarItemProps {
//   /**
//    * 路由地址
//    */
//   path: string;
// }

// const tabBarList: Array<TabBar> = [
//   {
//     text: '首页',
//     selectedIcon: (
//       <View className={cssModule.home}>
//         <IconFont name='user' size={44} />
//       </View>
//     ),
//     icon: (
//       <View className={cssModule.home}>
//         <IconFont name='user' size={44} />
//       </View>
//     ),
//     useCustomIcon: true,
//     path: '/pages/index/index',
//   },
//   {
//     text: '付款',
//     selectedIcon: (
//       <View className={cssModule.payment}>
//         <IconFont name='user' size={88} />
//       </View>
//     ),
//     icon: (
//       <View className={cssModule.payment}>
//         <IconFont name='user' size={88} />
//       </View>
//     ),
//     useCustomIcon: true,
//     path: '/pages/trade/order/index',
//   },

//   {
//     text: '我的',
//     selectedIcon: (
//       <View className={cssModule.mine}>
//         <IconFont name='user' size={44} />
//       </View>
//     ),
//     icon: (
//       <View className={cssModule.mine}>
//         <IconFont name='user' size={44} />
//       </View>
//     ),
//     useCustomIcon: true,
//     path: '/pages/user/index',
//   },
// ];

// interface CustomTabBarProps {
//   /**
//    * 子元素
//    */
//   children?: React.ReactNode;
//   /**
//    * tab 列表
//    */
//   tabs?: TabBarItemProps & { path: string }[];
// }

// interface CustomTabBarRef {
//   /**
//    * 切换当前选中tab
//    * @param index
//    * @returns
//    */
//   onChangeCurrentIndex: (index: number) => void;
// }

// const CustomTabBar: ForwardRefRenderFunction<CustomTabBarRef, CustomTabBarProps> = (
//   { children, tabs = tabBarList },
//   ref,
// ) => {
//   // 当前选中tab
//   const { currentIndex, setCurrentIndex } = useTabBarStore();

//   // 切换tab
//   interface OnChangeParams {
//     path: string;
//   }

//   interface OnChangeFunction {
//     (params: OnChangeParams, index: number): void;
//   }

//   const onChange: OnChangeFunction = ({ path }: TabBar, index: number) => {
//     setCurrentIndex(index);

//     Taro.switchTab({
//       url: path,
//     });
//   };

//   // 切换当前选中tab
//   const onChangeCurrentIndex = (index: number) => {
//     setCurrentIndex(index);
//     if (tabs[index]) {
//       onChange(tabs[index] as TabBar, index);
//     }
//   };

//   useImperativeHandle(ref, () => {
//     return {
//       onChangeCurrentIndex,
//     };
//   });

//   return (
//     <View className={cssModule.custom_tab_bar}>
//       {children && <View className={cssModule.custom_tab_bar_content}>{children}</View>}
//       <OsTabBar
//         isfixedBt
//         className={cssModule.custom_tab_bar_footer}
//         activeColor='#af7357'
//         defaultColor='#888888'
//         activeTabIdx={currentIndex}
//         onClick={onChange}
//         tabsArr={tabs as TabBarItemProps[]}
//       />
//     </View>
//   );
// };

// export default forwardRef(CustomTabBar);
